<!--
 * @Description: ...
 * @Author: yangli 121029539@qq.com
 * @Date: 2025-02-06 11:23:56
 * @LastEditTime: 2025-02-19 14:29:55
 * @LastEditors: yangli 121029539@qq.com
 * @FilePath: \uniapp\src\pagesrepair\applyinrepair.vue
-->
<template>
    <view class="bg-white min-h-screen ">
        <image src="/static/images/repair/repairTop.jpg" class="w-full " mode="widthFix"></image>
        <view class="pt-[40rpx] px-[40rpx]">
            <view class="text-[36rpx] text-main font-extrabold mb-[40rpx]">选择保单</view>
            <view class="input mb-[40rpx]">
                <u-radio-group v-if="state.productList.length" v-model="state.select_list" shape="circle" size="40"
                    wrap="true" active-color="var(--color-primary)">
                    <u-radio v-for="item in state.productList" :key="item.id" :name="item.id" :label="item.name">
                        <view class="product_items">
                            <view class="product_item flex items-center">

                                <view class="img" style="width: 100px;height: 100px;">
                                    <img :src="item.img" alt="">
                                </view>
                                <view class="info pt-3 flex-1">
                                    <view class="name">
                                        {{ item.spec }} {{ item.name }}
                                    </view>
                                    <view class="price">
                                        IMEI: {{ item.orderinfo.imei }}
                                    </view>

                                    <view class="year">
                                        有效期: {{ item.start_date }} 至 {{ item.end_date }}
                                    </view>
                                </view>
                            </view>

                        </view>
                    </u-radio>
                </u-radio-group>


            </view>
            <view class="">
                <u-button :loading="isLock" @tap="applyLock" type="primary">立即报修</u-button>
            </view>
        </view>
    </view>
</template>

<script setup lang="ts">
import { searchimei, insuranceList } from '@/api/repair'
import { onLoad, onShow, onPageScroll } from "@dcloudio/uni-app";
import { computed, reactive, ref, shallowRef } from 'vue'
import { useAppStore } from '@/stores/app'
import { useUserStore } from '@/stores/user'
import { useLockFn } from '@/hooks/useLockFn'

const appStore = useAppStore()
const userStore = useUserStore()
const token = computed(() => userStore.token)
const pageId = ref(0)
const imei = ref()

const state = reactive({
    productList: [],
    select_list: [],
    type: 0
})

const getUserInsurance = async () => {
    if (!token.value) return uni.showModal({
        title: '温馨提示',
        content: '当前账号未登录，无法提交',
        confirmText: '去登录',
        success: async res => {
            if (res.confirm) {
                uni.navigateTo({
                    url: '/pages/login/login'
                })
            }
        }
    })
    const res = await insuranceList({
        status: 20,
        type: state.type
    })
    state.productList = res.data
}


const { isLock, lockFn: applyLock } = useLockFn(async () => {


    if (!state.select_list) return uni.$u.toast('请选择要报修的保单')

    if (state.type == 4) {
        uni.redirectTo({
            url: `/pagesrepair/huanxin?id=${state.select_list}`
        })
    } else {
        uni.redirectTo({
            url: `/pagesrepair/applystep?id=${state.select_list}`
        })
    }

})


onLoad((options: any) => {
    state.type = options.type

    getUserInsurance()
})
</script>

<style lang="scss" scoped></style>
